import React from 'react';
import { render } from 'react-dom';
import { Provider } from 'mobx-react';
import { HashRouter as Router, Route, Switch, Redirect } from 'react-router-dom';
import { asyncComponent } from 'react-async-component';

import allStore from './stores';
import './style';

const coms = {
  Template: asyncComponent({
    resolve: () => import("./components/Template"),
  }),
}

const Root = () => (
  <Provider {...allStore}>
    <Router>
      <Route
        name="home"
        path="/"
        render={props => (
          <Switch>
            <Route name="template" path="/template" component={coms.Template} />
            <Redirect to="/template" />
          </Switch>
        )}
      />
    </Router>
  </Provider>
);

render(<Root />, document.getElementById('root'));
